<template>
  <div class="GswzIndex_">
      <el-carousel :interval="2000" height="600px" indicator-position="outside">
          <el-carousel-item v-for="(item,index) in indexImages" :key="index">
              <img class="showImg" :src="'/static/img/'+item.png" alt="" align="center">
          </el-carousel-item>
      </el-carousel>
      <!--产品优势-->
      <div class="advantage-box">
          <div class="main-title top-bottom">
              <p class="title" >产品优势</p>
              <p class="txt-gray-more small">电话机器人——“绿索智能”能够做的更好</p>
          </div>
          <div class="advantage-content width1200 bottom-top">
              <div class="col">
                <span class="img-box block">
                    <i class="icons icon-64x64 icon-advone"></i>
                </span>
                  <p class="title">提高效率，降低成本</p>
                  <p class="info">每日可完成原来5-10个人的工作，大大提高生产效率。</p>
              </div>
              <!--end .col-->
              <div class="col">
                <span class="img-box block">
                    <i class="icons icon-64x64 icon-advtwo"></i>
                </span>
                  <p class="title">管理零负担</p>
                  <p class="info">智能机器人标准应对话术，没有任何额外管理成本的超级电话员工。</p>
              </div>
              <!--end .col-->
              <div class="col">
                <span class="img-box block">
                    <i class="icons icon-64x64 icon-advthree"></i>
                </span>
                  <p class="title">固化优秀员工能力</p>
                  <p class="info">固定优秀员工的话术，实现意向客户筛选与快速挖掘。</p>
              </div>
              <!--end .col-->
              <div class="col">
                <span class="img-box block">
                    <i class="icons icon-64x64 icon-advfour"></i>
                </span>
                  <p class="title">智能化CRM管理</p>
                  <p class="info">帮助企业全面、客观、高效管理客户信息。</p>
              </div>
              <!--end .col-->
          </div>
      </div>
      <!--功能介绍-->
      <div class="function-box">
          <div class="main-title top-bottom">
              <p class="title">功能介绍</p>
              <p class="txt-gray-more small">怀揣“让人类专注创意”的梦想，落地人工智能语音技术的应用</p>
          </div>
          <div class="function-content width1200 bottom-top">
              <div class="col one">
                  <i class="icons icon-64x64 icon-fun01"></i>
                  <p class="title">完善的用户管理系统</p>
                  <p class="info">全自动管理企业客户的意向等级、通话记录等数据。数据统计全面，客观，高效。</p>
              </div>
              <!--end .col-->
              <div class="col two">
                  <i class="icons icon-64x64 icon-fun02"></i>
                  <p class="title">智能语音识别对答</p>
                  <p class="info">颠覆传统自动外呼只能播放语音的现状，系统支持模拟行业专家与目标客户进行通话，让你拥有复制的精英销售。</p>
              </div>
              <!--end .col-->
              <div class="col three">
                  <i class="icons icon-64x64 icon-fun03"></i>
                  <p class="title">自动外呼</p>
                  <p class="info">直接将客户号码导入，瞬间批量拨打客户电话，过程由呼叫平台自动完成，支持定时呼叫、筛选呼叫等功能。</p>
              </div>
              <!--end .col-->
              <div class="col four">
                  <i class="icons icon-64x64 icon-fun04"></i>
                  <p class="title">客户资料管理</p>
                  <p class="info">系统提供全程详实的通话录音，呼出了多少，哪个客户没有接通，接通时长，邀约是否成功，客户购买意向等数据。</p>
              </div>
              <!--end .col-->
          </div>
      </div>
      <!--应用领域-->
      <div class="application-box">
          <div class="main-title top-bottom">
              <p class="title">应用领域</p>
              <p class="txt-gray-more small">保险、法务、公关媒体、教育培训、健康领域、互联网行业、企业服务、亲情服务等其他一切有电话环节的行业</p>
          </div>
          <!--end .main-title-->
          <div class="application-content width1200">
              <div class="col-box">
                  <div class="col width30 left-right">
                      <div class="row purple text-right">
                          <p class="title">电商行业</p>
                          <p class="info"> 重大节日活动促销、通知、推广、电商服务推广、电商培训推广、电商代运营</p>
                      </div>
                      <!--end .row-->
                      <div class="row light-blue text-right">
                          <p class="title">汽车行业</p>
                          <p class="info">车险、新车销售4S店售后回访，厂商客户关怀</p>
                      </div>
                      <!--end .row-->
                  </div>
                  <!--end .col-->
                  <div class="col text-center width40">
                      <div class="circle">
                          <p class="title">“绿索智能”</p>
                          <p class="info">我是电话机器人</p>
                      </div>
                      <!--end .circle-->
                  </div>
                  <!--end .col-->
                  <div class="col width30 right-left">
                      <div class="row red">
                          <p class="title">房地产行业</p>
                          <p class="info">二手房中介房产销售，开发商新房销售</p>
                      </div>
                      <!--end .row-->
                      <div class="row blue">
                          <p class="title">金融行业</p>
                          <p class="info">贷款业务、保险业务的新客户开拓老客户回访，到期提醒、催促</p>
                      </div>
                      <!--end .row-->
                  </div>
                  <!--end .col-->
              </div>
              <!--end .col-box-->
              <div class="col-else pr bottom-top">
                  <p class="title">其他行业</p>
                  <p class="info">其他一切有电话环节的行业均适用</p>
              </div>
              <!--end .col-box-->
          </div>
          <!--end .application-content-->
      </div>
      <!--公司实力-->
      <div class="company-box">
          <div class="main-title top-bottom">
              <p class="title">公司实力</p>
              <p class="txt-gray-more small">让人类专注创新，用实力证明一切</p>
          </div>
          <!--end .main-title-->
          <div class="company-content width1200 bottom-top">
              <p class="txt-company">浙江绿索智能科技有限公司总部设在杭州，上海，苏州，南京已设立分支机构，</p>
              <p class="txt-company">市场今年规划布局华东、华北、华南三大市场</p>
              <div class="company-info">
                <span class="img-area block fl enlarge-img">
                    <img src="/static/img/photo01.png" alt="img">
                </span>
                  <div class="main-txt-box">
                      <ul>
                          <li>
                            <span class="img-box block">
                                <img src="/static/img/company01.png" alt="img">
                            </span>
                              <p class="title">技术实力</p>
                              <p class="info">研发团队在人工智能领域, 移动通信, 呼叫中心, 语音技术等相关领域深耕10多年</p>
                          </li>
                          <li>
                            <span class="img-box block">
                                <img src="/static/img/company02.png" alt="img">
                            </span>
                              <p class="title">公司理念</p>
                              <p class="info">让人类专注创意，从重复枯燥的工作中解放出来；帮助企业搭载人工智能，降低成本，提高效益</p>
                          </li>
                          <li class="bottom0">
                            <span class="img-box block">
                                <img src="/static/img/company03.png" alt="img">
                            </span>
                              <p class="title">公司愿景</p>
                              <p class="info">成为世界一流的AI应用提供商</p>
                          </li>
                      </ul>
                  </div>
                  <!--end .main-txt-box-->
              </div>
              <!--end .company-info-->
          </div>
      </div>
  </div>
</template>

<script>
export default {
  name: 'GswzIndex',
  data () {
    return {
        indexImages:[
            {png:'index/banner02.png'},
            {png:'index/banner03.png'},
            {png:'index/banner04.png'},
            {png:'index/banner05.png'},
            {png:'index/banner06.png'},
        ]
    }
  },
    created:function(){
        this.$nextTick(function () {
        })
    },
  methods: {
  }
}
</script>
<style scoped>
  .el-carousel__item:nth-child(2n) {
    background-color: #99a9bf;
  }
  .el-carousel__item:nth-child(2n+1) {
    background-color: #d3dce6;
  }
  .bounce-enter-active {
    animation: bounce-in .5s;
  }
  .bounce-leave-active {
    animation: bounce-in .5s reverse;
  }
  @keyframes bounce-in {
    0% {
      transform: scale(0);
    }
    50% {
      transform: scale(1.5);
    }
    100% {
      transform: scale(1);
    }
  }
  .showImg{
        height: 100%;
        width: auto;
    }
    .main-txt-box{
        margin-left: 498px!important;
    }
</style>
